﻿﻿<%@ page pageEncoding="UTF-8" %>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head> 
	<title>CrecheBook</title>
	<!-- meta -->
	<meta name="description" content="">
	<meta name="author" content="M. Steve">
	<link rel="shortcut icon" href="favicon.ico">
	<meta charset="UTF-8">
	
	<!-- CSS-->
	<link rel="stylesheet" href="medias/css/core.css" type="text/css" media="screen">
	
	<!-- JS -->
	<script src="medias/javaScript/inputs.js"></script>
	
	<!-- Google MAPS -->
	<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
	
	<!-- JQuery -->
	<meta name="viewport" content="width=device-width, initial-scale=1"> 
	<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
	<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
	<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
	


	
	
	
	
	
	
	 <script type="text/javascript">
                
                /* D?claration des variables  */
                var geocoder;
                var map;
                var markers = new Array();
                var lat;
                var lng;
                var i = 0;
                var userMarker= new google.maps.Marker();
                var cpt =0;
                
                
                /**
                * Initialise la Google map
                * @author STEVE 
                */
                function initialiserMAP() 
                {
                        clearMarkers();
                        /* Instanciation du geocoder  */
                        geocoder = new google.maps.Geocoder();
                        var myOptions = {
                        zoom: 15,
                        mapTypeId: google.maps.MapTypeId.ROADMAP
                        }
                        /* Chargement de la carte  */
                        map = new google.maps.Map(document.getElementById("carte"), myOptions);
                        
                        zoomAdress("Toulouse");
                }
                
                /**
                * Affiche un plan rapprocher par rapport a l'adresse
                * @author STEVE 
                */
                function zoomAdress(address)
                {
                        /* R?cup?ration de la valeur de l'adresse saisie */
                        geocoder.geocode( { 'address': address}, function(results, status) 
                        {
                                lat = results[0].geometry.location.lat();
                                lng = results[0].geometry.location.lng();
                                map.setCenter(results[0].geometry.location);
                        } 
                        
                        );
                }
                
                
                /**
                * Ajoute le markeur utilisateur sur la map
                * @author STEVE 
                */
                function addUserMarker(address)
                {
                        userMarker.setMap(null);
                        /* R?cup?ration de la valeur de l'adresse saisie */
                        geocoder.geocode( { 'address': address}, function(results, status) 
                        {
                                /* Si l'adresse a pu ?tre g?olocalis?e */
                                if (status == google.maps.GeocoderStatus.OK) 
                                {
                                        /* R?cup?ration de sa latitude et de sa longitude */
                                        lat = results[0].geometry.location.lat();
                                        lng = results[0].geometry.location.lng();
                                        map.setCenter(results[0].geometry.location);
                                        /* Affichage du marker */
                                        userMarker = new google.maps.Marker({
                                        map: map,
                                        position: results[0].geometry.location,
                                        title:address
                                        //icon : 'http://maps.google.com/mapfiles/marker_green.png'
                                        });
                                        
                                        /*google.maps.event.addListener(userMarker, 'click');*/
                                        
                                        
                                } 
                        }
                        );
                }
                
                /**
                * Montre la creche sur la map, zoom dessus
                * @author STEVE 
                */
                function showAddress() 
                {
                
                        
                        
                        /* R?cup?ration de la valeur de l'adresse saisie */
                        var address = document.getElementById("search").value;
                        
                        /* Appel au service de geocodage avec l'adresse en param?tre */
                        geocoder.geocode( 
                                { 'address': address}, function(results, status) 
                                {
                                        /* Si l'adresse a pu ?tre g?olocalis?e */
                                        if (status == google.maps.GeocoderStatus.OK) 
                                        {
                                                /* R?cup?ration de sa latitude et de sa longitude */
                                                lat = results[0].geometry.location.lat();
                                                lng = results[0].geometry.location.lng();
                                                map.setCenter(results[0].geometry.location);
                                                map.setZoom(13);
                                                
                                                addUserMarker(address);
                                        } 
                                }
                        );
                }
                        
                
                /**
                * Lance la page web sur une creche a partir de son marker
                * @author STEVE 
                * @param marker: marqueur cible
                */
                function loadURL(marker) 
                {
                        return function () 
                        {
                                window.location.href = marker.url;
                        }
                }
                
                
                /**
                * Suprime tout les marqueur de la map
                * @author STEVE 
                */
                function clearMarkers()
                {
                        for(i;i < markers.length;i++)
                              markers[i].setMap(null);
                                
                        userMarker.setMap(null);
                }
                
                
				function sleep(milliSeconds){
				var startTime = new Date().getTime(); // get the current time
				while (new Date().getTime() < startTime + milliSeconds); // hog cpu
				}
                
                /**
                * Ajoute un Marker sur la map
                * @author STEVE 
                * @param address: addresse de la creche
                * @param name: nom de la creche
                * @param myurl: url pour avoir plus d'information sur la creche
                */
                function addMarker(address,name,myurl) 
                {
                        /* R?cup?ration de la valeur de l'adresse saisie */
                        geocoder.geocode( { 'address': address}, function(results, status) 
                        {
                                /* Si l'adresse a pu ?tre g?olocalis?e */
                                if (status == google.maps.GeocoderStatus.OK) 
                                {
                
                                        /* R?cup?ration de sa latitude et de sa longitude */
                                        //lat = results[0].geometry.location.lat();
                                        //lng = results[0].geometry.location.lng();
                                        //alert ("ok");
                                        //map.setCenter(results[0].geometry.location);
                                        /* Affichage du marker */
                                        var marker = new google.maps.Marker({
                                        map: map,
                                        position: results[0].geometry.location,
                                        title:name,
                                        icon: 'medias/images/maison-maison-icone-6802-48.png',
                                        url:myurl
                                        });
                                        
                                        google.maps.event.addListener(marker, 'click', loadURL(marker));
                                        
                                        
                                        /* Permet de supprimer le marker pr?c?demment affich? */
                                        markers.push(marker);
                                } 
                        }
                        );
                }
                
                
                
                /**
                * Ajoute un Marker sur la map
                * @author STEVE 
                * @param address: addresse de la creche
                * @param name: nom de la creche
                * @param myurl: url pour avoir plus d'information sur la creche
                */
                function addMarkerCord(x,y,name,myurl) 
                {
                        var myLatlng = new google.maps.LatLng(x,y);
                
                        var marker = new google.maps.Marker({
                        map: map,
                        position:  myLatlng,
                        title:name,
                        icon: 'medias/images/maison-maison-icone-6802-48.png',
                        url:myurl
                        });
                                        
                        google.maps.event.addListener(marker, 'click', loadURL(marker));
                                        
                                        
                        /* Permet de supprimer le marker pr?c?demment affich? */
                        markers.push(marker);
                }
                
                /**
                * Effectue une requette JSON pour receuillir les creches existante dans la base de donn?e
                * @author STEVE 
                */
                function getMarker()
                {
                        $.getJSON("MarkerJSON",showMarker).error(displayError);
                }
                
                
                
                /**
                * Affiche les creches de la base de donn?e
                * @author STEVE
                * @param jsonResult
                */
                function showMarker(jsonResult) 
                {
                        zoomAdress("Toulouse");
                        for (var i in jsonResult) 
                        {
                                sleep(50);
                                addMarkerCord(
                                        jsonResult[i].adresse.coord_x,
                                        jsonResult[i].adresse.coord_y,
                                        jsonResult[i].nom,
                                        "creche.jsp?nom="+jsonResult[i].nom+"&ville="+jsonResult[i].adresse.ville);
                        }
                
                
                }
                
		</script>
</head> 
<body onLoad="initialiserMAP();searchBox_exit();getMarker();"> 

<div data-role="page">

	<div data-role="header">
		
		
		<div id="banniere">
			<br>
			<br>
			<h1 >CrecheBook</h1>
		</div>
		
		<div id="searchBox">

			<div class="ui-bar ui-bar-c">	
				
				<div class="ui-grid-a">
					<div class="ui-block-a"><input type="text" id="search" onChange="searchBox_exit()" onFocus="searchBox_enter()" onKeyPress="searchBox_complete()"  value=""></div>
					<div class="ui-block-b"><input type="button" value="Rechercher" id="bt_search" data-icon="search" onClick="showAddress()"></div>
				</div>
			</div>
			
		</div>  
	</div><!-- /header -->

	<div data-role="content">
	<!-- Modifier ici -->

                <center><div id="carte"></div></center>

			

		
	</div><!-- /content -->

	<div data-role="footer">
		
		<h4 style="margin:30px;">
			<strong> CrecheBook 2013</strong> <br>
			<a href="legal.jsp" data-ajax="false">Mentions&nbsp;l&eacute;gales</a>&nbsp;|&nbsp;
			<a href="connexion" data-ajax="false">Administateur</a>
		 </h4>
		    
	</div><!-- /footer -->
</div><!-- /page -->

</body>
</html>